<template>
  <div class="passwordAlert">
    <div class="icon">
      <span></span>
    </div>
    <h4> Wi-Fi配置成功</h4>
    <p class="message">Storage设备已成功使用此Wi-Fi联网</p>
    <el-button class="btn" @click="emit('close')">确定</el-button>
  </div>
</template>

<script setup>
const emit = defineEmits(['close'])
</script>

<style lang="scss" scoped>
.passwordAlert {
  width: 100%;
  height: 180px;

  .icon {
    display: flex;
    width: 100%;
    justify-content: center;
    margin-bottom: 20px;
    margin-top: 20px;

    span {

      width: 44px;
      height: 44px;
      background: url('@/icons/成功.svg') no-repeat center;
    }

  }

  h4 {
    width: 100%;
    text-align: center;
    margin-bottom: 20px;
  }

  .message {
    width: 100%;
    text-align: center;
    color: #666;
    text-align: center;
    font-size: 12px;
    margin-bottom: 20px;

  }

  .btn {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
  }
}
</style>